<!-- Data Tables -->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox float-e-margins" style="background: white;padding: 10px">

                <div class="ibox-title">
                    <h5>{:lang('MyLink')}</h5>
                </div>

                <div class="ibox-content">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="contact-box phone col-sm-6">
                                <img style="opacity: 0;" alt="image" class="m-t-xs img-responsive"
                                     src="https://www.kuaizhan.com/common/encode-png?large=true&data=http://{$_SERVER['HTTP_HOST']}/admin/login/register?left={$left}">

                                <div class="imgCode">
                                    <div class="m-t-xs font-bold">{:lang('Link')}</div>
                                    <img alt="image" class="m-t-xs img-responsive"
                                         src="https://www.kuaizhan.com/common/encode-png?large=true&data=http://{$_SERVER['HTTP_HOST']}/admin/login/register?left={$left}">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<style media="screen">
    .phone {
        background-image: url(__IMG__/phone.jpg);
        background-size: contain;
        background-image: url(/static/admin/images/phone.jpg);
        background-repeat: no-repeat;
        position: relative;
        background-position: center;
        /* max-height: 38rem; */
        /* max-width: 19rem; */
        border: 0;
        width: 100%;
        /* min-height: 35rem; */
    }

    .phone .imgCode {
        left: 50%;
        top: 50%;
        text-align: center;
        transform: translate(-50%, -50%);
        position: absolute;
    }

    .phone .imgCode img {
        width: 45%;
        min-width: 70px;
        margin: 0 auto;
    }
</style>

<script type="text/javascript">

    window.onresize = function () {
        changeDivHeight();
    }

    function changeDivHeight() {
        var designWidth = 750,
                rem2px = 100;
        document.documentElement.style.fontSize = window.innerWidth / designWidth * rem2px / 16 * 100 + '%';
    }

    function operateFormatter(value, row, index) {
        return [
            '<a class="btn btn-xs edit" href="javascript:void(0)" title="{$Think.lang.Edit}">',
            '<i class="fa fa-edit"></i>',
            '</a>  ',
            '<a class="btn btn-xs delete" href="javascript:void(0)" title="{$Think.lang.Delete}">',
            '<i class="fa fa-trash"></i>',
            '</a>'
        ].join('');
    }

    var operateEvents = {
        'click .edit': function (e, value, row, index) {
            var param = {
                url: "{:url('admin/user/edit');}",
                data: {
                    id: row.id
                }
            }
            $("#table").gridView('loadModal', param.url, param.data)
        },
        'click .delete': function (e, value, row, index) {
            $("#table").gridView('deleteModal', 'delete', row)

        }
    };
</script>
